<link href="/css/style.css" rel="stylesheet">
<link href="/css/style-responsive.css" rel="stylesheet">
<style>
	.EvenOrOddRow {
		background-color: expression((this.sectionRowIndex%2)?'white': '#E0E0E0');
	}
</style>

<body class="panel" style="padding: 0;">
	<div class="row">
		<div class="col-sm-12">
			<div class="panel-body">
				<header class="panel-heading" style="height: 50;">

					<div class="col-md-9">acs业务auth账户</div>
					<div class="col-md-3" align="right">
						<label>
						<select   class="form-control" id="groupSelect" onchange="changeGroup()" size="1" name="hidden-table-info_length" aria-controls="hidden-table-info">
						  
						<option value="acs_user">acs_user组</option>
						<option value="acs_manager">acs_manager组</option>
					</select>  </label>
						<button class="btn btn-success btn-sm" onclick="changeGroup()">刷新</button>

					</div>
				</header>
				<div class="adv-table ">

					<table class="display table " id="listTable" width="100%">
						<thead>
							<tr>
								<th width="20%">登录名</th>
								<th width="20%">电话</th>
								<th width="20%">Email</th>
								<th width="20%">姓名</th>
								<th width="20%" align="right" contenteditable="false"> </th>
							</tr>
						</thead>
						<tbody id="maintablebody">
						</tbody>
					</table>
				</div>
	<!--	//-----------弹出赋权的窗口------start------------>
				<div class="modal fade" id="userPrivilegeModal" tabindex="-2" role="dialog" aria-labelledby="userPrivilegeModalLabel" aria-hidden="true">
					<div class="modal-dialog">
						<div class="modal-content">
							<div class="modal-header">
								<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
								<h4 id="privilegePanelLabel" class="modal-title">分配该用户操作以下对象的权限</h4>
							</div>
							<header class=" ">
								<ul class="nav nav-tabs">
									<li>
										<a>
											<i class="fa fa-users"></i>
										</a>
									</li>
									<li class="active">
										<a data-toggle="tab" onclick="currentPrivilegeChannel = 't_app';selectPrivilegeTarget()">
											<i class="fa fa-user"></i> APP
										</a>
									</li>
									<li>
										<a data-toggle="tab" onclick="currentPrivilegeChannel = 'jumei_api';selectPrivilegeTarget()">
											<i class="fa  fa-magnet"></i>登录用户可使用的api
										</a>
									</li>
								</ul>
							</header>

							<div class="panel-body">
								<div class="tab-content" id="appTableContentList">
									<div class="tab-pane active" id="userDiv">
										<div class="row" id="privilegeListDiv">
											<div class="col-md-6" >
												<table class="  table table-hover">

													<tbody id="privilegeTargetList">
													</tbody>
												</table>
											</div>
											<div class="col-md-6" >
												<div class=" adv-table">
													<table class="display table table-striped" id="listTable" width="100%"  >

														<tbody id="privilegeListTable" hidden="hidden" >

															<tr>
																<td ><input type="checkbox" id="roleUpdate" onchange="setUserPrivilege(this,'update')" />修改</td>
															</tr>
															<tr>
																<td><input type="checkbox" id="roleDelete" onchange="setUserPrivilege(this,'delete')" />删除</td>
															</tr>
															<tr>
																<td><input type="checkbox" id="roleQuery" onchange="setUserPrivilege(this,'read')" />查询</td>
															</tr>
														</tbody>
													</table>

												</div>

											</div>
										</div>
										<!--下面是对api 的权限赋值 -->
										<div class="row" id="userApiListDiv">
											<div class="col-md-12"  >
												<table class="  table table-hover">
															<thead>
																<th> </th>
																<th>method</th>
																<th>api</th>
															</thead>
															<tbody id="userApiListTable">
													</tbody>
												</table>
											</div> 
										</div>
										
										<!---->
										<div class="row">
											<div class="col-md-12">
												<!-- 分页模块 -->
												<div id="pageLabelDiv" align="left" class="dataTables_paginate paging_bootstrap pagination">
													<ul>
													</ul>
												</div>
											</div>
										</div>

										<div class="row">
											<div class="col-md-5"></div>
											<div class="  row">
												<button class="btn btn-success btn-sm" onclick="saveUserPrivilege();">保存</button>
											</div>
											<div class="col-md-5">
												<img src="images/input-spinner.gif" id="showBusyImg" hidden="hidden" />
											</div>
										</div>
									</div>
									<!--<div class="tab-pane" id="appDiv">
										<p>Vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.</p>
										<p>Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute,</p>
									</div>
									<div class="tab-pane" id="logDiv">
										<p>Vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.</p>
										<p>Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute,</p>
									</div>-->
								</div>
							</div>
						</div>
					</div>
				</div>
	<!--	//-----------弹出 赋权的窗口------end------------>
			</div>

			<!-- Placed js at the end of the document so the pages load faster -->
			<script src="/js/html5shiv.js"></script>
			<script src="/js/respond.min.js"></script>

			<script src="/js/jquery-1.10.2.min.js"></script>
			<script src="/js/jquery-ui-1.9.2.custom.min.js"></script>

			<script src="/js/jquery-migrate-1.2.1.min.js"></script>
			<script src="/js/bootstrap.min.js"></script>
			<script src="/js/modernizr.min.js"></script>
			<script src="/js/jquery.nicescroll.js"></script>
			<script>
				var totalCount = 0
				var currentPage = 1
				var step = 5
				var currentId = 0
				var tablebody
				var currentListData
				var adddata
				var host
				var userWithPirvilege
				var allUser = 1
					//从API获取数据列表
				function getList(group) {

					$.get(host + "/list_user/" + group, null, listToSuccess, "json");

				}
				//页面载入后先获取默认条数的数据
				window.onload = function() {
					host = "http://" + window.location.host
					getList("acs_user");
				};
 function onBodyResize() { 
 
		}
				//采用本地数组中的数据填充表格
				function fillTable() {
					adddata = "";
					var userlist = currentListData.details;
					for(var username in userlist) {
						var item = userlist[username]
						adddata += ("<tr ");
						var start_s = "";
						var end_s = " ";
						if(item.is_manager == true) {
							adddata += (" title='管理员'  bgcolor='#aabbaa'>");
						} else {
							adddata += (" title='普通用户' >");
						}
						adddata += ("<td>" + start_s + username + end_s + "</td>");
						adddata += ("<td>" + start_s + item.mobile + end_s + "</td>");
						adddata += ("<td>" + start_s + item.mail + end_s + "</td>");
						adddata += ("<td>" + start_s + item.fullname + end_s + "</td>");

						adddata += ("<td align='right' >");
						//	var roleStr = "<a data-toggle='modal' href='#userPrivilegeModal'  class='btn btn-warning  btn-sm' onclick=\"editUserPrivilege('" + username + "\')\" >赋权</a>";

						if(userWithPirvilege.is_manager == true) {
							if(item.is_manager == false) {
								adddata += ('<a data-toggle="modal" href="#userPrivilegeModal"  class="btn btn-warning  btn-sm" onclick="editUserPrivilege(\'' + username + '\')" >赋权</a>');
							} else {
								adddata += ("<button type='button' class='btn btn-sm'    onclick='alert(\"已经是管理员，拥有所有权限\")'   >赋权</button>");
							}
						}
						adddata += " </td>";

						adddata += "</tr>";
					};
					tablebody.append(adddata);
					clearPrivilegeDispaly();
				}
				//清空数据表格
				function clearDataTable() {
					tablebody = $("#maintablebody");
					tablebody.empty();
				}
				//从数据库中获取列表成功
				function listToSuccess(response, status, xhr) {
					if(status == "success" && response.reusltCode == "200") { 
						currentListData = response.reusltDetail;
						userWithPirvilege = response.reusltTitle;
						totalCount = response.totalCount; 
						clearDataTable();
						fillTable();
						parent.setMainContentHeight(totalCount,50);
					} else {
						alert(response);
					}

				}
				//每页的条数发生改变时  重新计算分页条数
				function changeGroup() {
					getList(document.getElementById("groupSelect").value);

				}

				function editUserPrivilege(username) {

					document.getElementById("privilegePanelLabel").innerText = "赋予 [ " + username + " ] 操作以下对象的权限";
					if(allChannleItemList == null || currentusername != username) {
						currentusername = username;
						selectPrivilegeTarget();
					} else {
						clearSelectAllTarget();
					}
				}
				//当前要操作的赋权频道 
				var currentPrivilegeChannel = "t_app"

				function selectPrivilegeTarget() {
					$.get(host + "/list_target/" + currentPrivilegeChannel + "/user/" + currentusername, null, listTargetSuccess, "json");
				}
				var currentusername
				var allChannleItemList
				var thisPageChannelItemList

				var userPrivilegemap = new Map();

				function listTargetSuccess(response, status, xhr) {
					if(status == "success" && response.reusltCode == "200") {

						$("#privilegeTargetList").empty();
						allChannleItemList = response.reusltDetail;
						currentPage = 1;
						userPrivilegemap[currentusername] = response.reusltTitle;
						//	var currentuserWithPirvilege =userPrivilegemap[currentusername];
						//currentuserWithPirvilege = response.reusltTitle;
						if(userPrivilegemap[currentusername].privilege_list == null) {
							userPrivilegemap[currentusername].privilege_list = new Array();
						}
						totalCount = response.totalCount;
						if(response == null) {
							return
						}
						displayApplist();
						for(var j = 0; j < userPrivilegemap[currentusername].privilege_list.length; j++) {
							var currentitem = userPrivilegemap[currentusername].privilege_list[j];
							if((currentitem.target_row == 0) && (currentitem.action == "create")) {
								if(currentitem.target_table == "t_app" && currentPrivilegeChannel == "t_app") {
									document.getElementById("createApp").checked = true;
									break;
								}
							}
						}
						parent.setMainContentHeight(allChannleItemList.length,50);
					} else {
						clearPrivilegeDispaly();
						alert(response)
					}

					document.getElementById("privilegeListTable").hidden = "hidden";
				}

				function displayApplist() {

					if(currentPage < 1) {
						currentPage = 1;
					}
					if(currentPage > Math.ceil(totalCount / step)) {
						currentPage = Math.ceil(totalCount / step);
					}
					thisPageChannelItemList = allChannleItemList.slice((currentPage - 1) * step, currentPage * step);
					
					adddata = "";

					$.each(thisPageChannelItemList, function(index, item) {

						adddata += ("<tr  ");
						  if(currentPrivilegeChannel == "jumei_api") {
							adddata += ("  onclick='changeJumeiApiActiveRow(this," + item.id + ",\""+ item.method  +"\");'  name=" + index + ">");
							adddata += ("<td   ><input type='checkbox' id='select" + index + "' name='" + item.id + "' class='selectTargetItem'  /></td>");
							adddata += ("<td   >"+ item.method  + "</td>");
							adddata += ("<td >" + item.url + "</td>");
						}else  {
							adddata += (" onclick='changeActiveRow(this," + item.id + ");'  name=" + index + ">");
							adddata += ("<td><input type='checkbox' id='select" + index + "' name='" + item.id + "' class='selectTargetItem' disabled='disabled'  />" + item.bundle_id + "</td>");
						} 

						adddata += "</tr>";

					});
					// jumei_api 是聚美业务部门调用的api。 此channel不具备创建api的功能。
					if(currentPrivilegeChannel == "jumei_api") { 
						$("#userApiListTable").empty();
						document.getElementById("privilegeListDiv").hidden = "hidden";
						document.getElementById("userApiListDiv").hidden = "";
						$("#userApiListTable").append(adddata);
					} else {
						$("#privilegeTargetList").empty();
						document.getElementById("userApiListDiv").hidden = "hidden";
						document.getElementById("privilegeListDiv").hidden = "";
						adddata += ("<tr  onclick='changeActiveRow(this,-1);' ><td>新增的权限</td><td><input id='createApp' onchange='onSelectCreateApp()' type='checkbox'  /></tr>");
						$("#privilegeTargetList").append(adddata);
						
						clearPrivilegeDispaly();
						
					}
					clearSelectAllTarget();
					
					
					
				}

				function onSelectCreateApp() {
					if(document.getElementById("createApp").checked == true) {
						addPrivilege("t_app", 0, "create");
					} else {
						cutPrivilege("t_app", 0, "create");
					}
					//-----------------------------

				}

				function addPrivilege(tablename, row, action) {
					var hasThisPrivilege = false;
					if(userPrivilegemap[currentusername].privilege_list) {

						for(var j = 0; j < userPrivilegemap[currentusername].privilege_list.length; j++) {
							var currentitem = userPrivilegemap[currentusername].privilege_list[j];
							if(currentitem.target_table == tablename && currentitem.action == action && currentitem.target_row == row) {
								hasThisPrivilege = true;
							}
						}
					} else {
						userPrivilegemap[currentusername].privilege_list = new Array();
					}
					if(hasThisPrivilege == false) {
						var newPrivielge = new Object();
						newPrivielge.target_table = tablename;
						newPrivielge.action = action;
						newPrivielge.target_row = row;
						newPrivielge.username = currentusername;
						newPrivielge.id = 0;
						userPrivilegemap[currentusername].privilege_list = userPrivilegemap[currentusername].privilege_list.concat(newPrivielge)
					}
					//如果是之前临时删除的，那么就不删了
					for(var j = 0; j < removePrivileteList.length; j++) {
						var currentitem = removePrivileteList[j];
						if(currentitem.target_table == tablename && currentitem.action == action && currentitem.target_row == row) {
							removePrivileteList.splice(j, 1);
						}
					}
					if(currentPrivilegeChannel != "jumei_api") {
						currentActiveRow.childNodes[0].childNodes[0].checked = checkAppHasPrivilete(tablename, row); // (currentuserWithPirvilege.privilege_list.length > 0);	
					}

				}
				var removePrivileteList = new Array()

				function cutPrivilege(tablename, row, action) {

					if(userPrivilegemap[currentusername].privilege_list) {

						for(var j = 0; j < userPrivilegemap[currentusername].privilege_list.length; j++) {
							var currentitem = userPrivilegemap[currentusername].privilege_list[j];
							if(currentitem.target_table == tablename && currentitem.action == action && currentitem.target_row == row) {
								removePrivileteList = removePrivileteList.concat(currentitem)
								userPrivilegemap[currentusername].privilege_list.splice(j, 1);
							}
						}

					}
					if(currentPrivilegeChannel != "jumei_api") {
						currentActiveRow.childNodes[0].childNodes[0].checked = checkAppHasPrivilete(tablename, row);
					}

				}

				function checkAppHasPrivilete(tablename, row) {
					for(var j = 0; j < userPrivilegemap[currentusername].privilege_list.length; j++) {
						var currentitem = userPrivilegemap[currentusername].privilege_list[j];
						if(currentitem.target_table == tablename && currentitem.target_row == row) {
							return true
						}
					}
					return false
				}

				function clearSelectAllTarget() {
					// 
					for(var i = 0; i < thisPageChannelItemList.length; i++) {
						document.getElementById("select" + i).checked = false;
						if(userPrivilegemap[currentusername].privilege_list != null) {
							for(var j = 0; j < userPrivilegemap[currentusername].privilege_list.length; j++) {
								var currentitem = userPrivilegemap[currentusername].privilege_list[j];
								if((currentitem.target_table == currentPrivilegeChannel )&& ((currentitem.target_row == thisPageChannelItemList[i].id))) { 
									document.getElementById("select" + i).checked = true;
								}
							}
						} else {
							document.getElementById("select" + i).checked = false;
						}
					}

					clearPrivilegeDispaly();
					changeStep(true);
					if(currentPrivilegeChannel != "jumei_api") {
						//	document.getElementById("privilegeListTable").hidden = "hidden";

						changeActiveRow(null, -1);
					}
				}

				function onBodyResize() {
					//document.getElementById("advtable").width = parent.document.body.clientWidth-210;
					if(this.height < (window.innerHeight - 40)) {
						this.height = window.innerHeight - 40;
					}

				}

				function clearPrivilegeDispaly() {
					document.getElementById("roleUpdate").checked = false;
					document.getElementById("roleDelete").checked = false;
					document.getElementById("roleQuery").checked = false;
				}

				//每页的条数发生改变时  重新计算分页条数
				function changeStep(onlyChangeStep) {
					var pagelabelDiv = $("#pageLabelDiv ul");
					pagelabelDiv.empty();
					var pageNum = Math.ceil(totalCount / step);
					if(currentPage <= 1) {
						pagelabelDiv.append('<li class="prev disabled"><a >← Previous</a></li>');
					} else {
						pagelabelDiv.append('<li class="prev" onclick="currentPage -= 1;displayApplist()"><a >← Previous</a></li>');
					}
					if(pageNum > 6) {
						for(var i = 1; i <= pageNum; i++) {
							if((i) == currentPage) {
								pagelabelDiv.append('<li class="active"><a   >' + (i) + '</a></li>');
							} else if((i <= 2)) {
								pagelabelDiv.append('<li onclick="currentPage = ' + (i) + ';displayApplist()" ><a  >' + (i) + '</a></li>');
							} else if((i >= currentPage - 1 && (i <= currentPage + 1)) || (i > pageNum - 2)) {
								pagelabelDiv.append('<li onclick="currentPage = ' + (i) + ';displayApplist()" ><a  >' + (i) + '</a></li>');
							}
						}

					} else {
						for(var i = 1; i <= pageNum; i++) {
							if((i) == currentPage) {
								pagelabelDiv.append('<li class="active"><a   >' + (i) + '</a></li>');
							} else {
								pagelabelDiv.append('<li onclick="currentPage = ' + (i) + ';displayApplist()" ><a  >' + (i) + '</a></li>');
							}
						}
					}
					if(currentPage >= pageNum) {
						pagelabelDiv.append('<li class="next disabled"><a href="#">Next → </a></li>');
					} else {
						pagelabelDiv.append('<li class="next" onclick="currentPage += 1;displayApplist()"><a href="#">Next → </a></li>');
					}
					if(onlyChangeStep == false) {
						selectPrivilegeTarget();
					}
				}
				var currentActiveRow;
				var currentPrivilegeItemId;

				function changeActiveRow(obj, appid) {
					clearPrivilegeDispaly();
					if(currentActiveRow) currentActiveRow.style.backgroundColor = "";
					if(obj) {
						currentActiveRow = obj;
						currentActiveRow.style.backgroundColor = "#e6e6e6";
						currentPrivilegeItemId = appid;
					}
					if(currentPrivilegeItemId > 0) {
						document.getElementById("privilegeListTable").hidden = "";
						if(userPrivilegemap[currentusername].privilege_list == null) {
							return;
						}
						var thisUserPrivilegeOfThisItem = new Array()
						for(var j = 0; j < userPrivilegemap[currentusername].privilege_list.length; j++) {
							var currentitem = userPrivilegemap[currentusername].privilege_list[j];
							if(currentitem.target_table == currentPrivilegeChannel && ((currentitem.target_row == currentPrivilegeItemId) || (currentitem.target_row == 0))) {
								thisUserPrivilegeOfThisItem = thisUserPrivilegeOfThisItem.concat(currentitem);
							}

						}
						setPrivilegeDisplay(thisUserPrivilegeOfThisItem)
					} else {
						document.getElementById("privilegeListTable").hidden = "hidden";
					}
				}

				function setPrivilegeDisplay(privilegeList) {
					for(var j = 0; j < privilegeList.length; j++) {
						var currentitem = privilegeList[j];
						if(currentitem.action == "update") {
							document.getElementById("roleUpdate").checked = true;
						} else if(currentitem.action == "delete") {
							document.getElementById("roleDelete").checked = true;
						} else if(currentitem.action == "read") {
							document.getElementById("roleQuery").checked = true;
						}
					}
				}

				function changeJumeiApiActiveRow(obj, itemid,method) {
				//	document.getElementById("privilegeListTable").hidden = "hidden";
					if(currentActiveRow) currentActiveRow.style.backgroundColor = "";
					if(obj) { 
						currentActiveRow = obj;
						currentActiveRow.style.backgroundColor = "#e6e6e6";
						currentPrivilegeItemId = itemid; 
					}
					if(currentPrivilegeItemId > 0) {
						console.log(currentActiveRow.childNodes[0])
						if(currentActiveRow.childNodes[0].childNodes[0].checked == true) {
							addPrivilege(currentPrivilegeChannel, currentPrivilegeItemId,method);
						} else if(currentActiveRow.childNodes[0].childNodes[0].checked == false) {
							cutPrivilege(currentPrivilegeChannel, currentPrivilegeItemId, method);
						}
					}
				}

				function setUserPrivilege(checkboxitem, action) {
					if(checkboxitem.checked == true) {
						addPrivilege(currentPrivilegeChannel, currentPrivilegeItemId, action);
					} else {
						cutPrivilege(currentPrivilegeChannel, currentPrivilegeItemId, action);
					}
				}

				function saveUserPrivilege() {
					var sendObj = new Object()
					sendObj.addPrivilegelist = userPrivilegemap[currentusername].privilege_list;
					sendObj.cutPrivilegelist = removePrivileteList;
					document.getElementById("showBusyImg").hidden = "";
					$.post(host + "/user_privilege/" + currentusername, JSON.stringify(sendObj), saveUserPrivilegeSuccess, "json");
				}

				function saveUserPrivilegeSuccess(response, status, xhr) {
					if(status == "success" && response.reusltCode == "200") {
						userPrivilegemap[currentusername] = response.reusltTitle;
						removePrivileteList = new Array();
						$("#userPrivilegeModal").modal("hide");
						alert("保存成功");
					} else {
						alert(response);
					}
					document.getElementById("showBusyImg").hidden = "hidden";
				}
			</script>

</body>